<template>
	<view>
		<cu-custom bgColor="bg-gradual-blue" :isBack="true">
			<block slot="backText">返回</block>
			<block slot="content">同类商品</block>
		</cu-custom>
		
		<view class="content">
			<view class="cu-card case">
				<view class="bg-white padding">
					<view class="grid margin-bottom text-center col-2 sm">
						<view class="padding-sm" v-for="(item,index) in goodList" :key="item.id">
							<navigator :url="'../detail/detail?'+'id='+item.spuId" open-type="navigate">
								<view class="padding radius text-center shadow-warp bg-white">
									<view>
										<image :src="imageSrc+item.image" mode="aspectFit"></image>
									</view>
									<view class="text-lg text-center">{{item.name}}</view>
									<view class="margin-top-sm text-Abc text-red">价格：{{item.price}}RMB </view>
								</view>
							</navigator>
						</view>
					</view>
				</view>
			</view>
		</view>
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				imageSrc: 'http://123.57.7.108:81/',
				goodList:[],
				params:{
					brandId:'',
					cateId:'',
					pageNum:1,
					pageSize:10,
					query:''
				}
			}
		},
		onLoad(data) {
			this.params.cateId = data.id;
			this.init();
			
		},
		onPullDownRefresh() {
			this.params.pageNum=1;
			this.goodList = [];
			this.init();
		},
		onReachBottom() {
			this.params.pageNum++;
			this.init();
		},
		methods: {
			init:function(id){
				this.$api.api_skusPage(this.params)
				.then(res =>{
					if(res.data.data.list.length>0){
						res.data.data.list.forEach(item =>{
							this.goodList.push(item);
						})
					}else{
						uni.showToast({
							title:'数据已经加载完！'
						})
					}
				})
				.catch(res =>{
					console.log(error)
				})
			}
		}
	}
</script>

<style>

</style>
